<template>
  <div class="shequ">
   
        <div  :class="[winscrooll?'homeNewLeftTopScroll':'home-new-left-top']" class="left-topshenqu">
           <div >
            <p v-for="(item, index) in leftli" :key="index">
              <span @click="select(item.text)" :class="{ clicked: selected == item.text }">{{ item.text }}</span>
            </p>
           </div> 
           <div style="min-width: 30%;">
            <el-input
      style="min-width: 100%"
      placeholder="请输入搜索内容"
    >
    
  
    </el-input>
           </div>
           <div style="margin-right: 20px;">
            <el-button @click="goediter" type="success" round>立即分享</el-button>
           </div>
        </div>
        <FsEstimatedVirtualList class="fslist" ref="lists" :data-source="potsElements" :estimated-height="60" @getMoreData="addData">
              <template #item="{ item }">
                <pots :datas="item" class="pots"></pots>
              </template>
        </FsEstimatedVirtualList>
      </div>
  
</template>

<script setup>
import { ref, reactive,defineEmits,onMounted,computed } from 'vue'
import {  ElInput,ElButton} from 'element-plus'
import FsEstimatedVirtualList from '@/components/FsEstimatedVirtualList.vue'
import pots from '@/components/sonmepost.vue'
import { selectpost } from '@/api/request/userxx/requestuser'
import { useCounterStore } from '@/store/index.js'
import emitter from '@/function/eventBus'
const store = useCounterStore()
const winscrooll = computed(() => store.winscrooll>100? true : false)
const potsElements = ref([
 
]);
const leftli = [
  { isshoye: false, text: '关注' },
  { isshoye: false, text: '综合' },
  { isshoye: false, text: '热门' },
  { isshoye: false, text: '板块' },
]
const emit = defineEmits(['updateValue'])
const loading = ref(false);
const selected = ref('综合')
const goediter = () => {
  emitter.emit('changerouter', 'Edit' )
}
const addData = (length) => {
  loading.value = true;
  setTimeout(() => {
    const newData = [];
    if(potsElements.value.length>=40){
    loading.value = false;
    return
  }
    for (let i = 0; i < 10; i++) {
      const len= potsElements.value.length + newData.length;
      newData.push({
        id: len,
        content: len, // 内容
      });
    }
    potsElements.value = [...potsElements.value, ...newData];
    console.log(potsElements.value);
    
    loading.value = false;
  }, 2000);
};
const selectposts = async () => {

const res = await selectpost({ uid: store.userid, type: selected.value })
console.log(res);

}
const select = (text) => {
  selected.value = text

}
onMounted(async () => {
  addData()
  await selectposts()
 
});
</script>

<style >
@import '@/assets/css/shequ.css';
</style>